@extends('layouts.app')

@section('title', '用户仪表板 - InfluWatchDog')
@section('description', 'InfluWatchDog用户仪表板')

@section('navbar')
    <x-navbar type="dashboard">
        <x-slot:desktopMenu>
            <li><a href="#" class="hover:text-primary">账户管理</a></li>
        </x-slot:desktopMenu>
        
        <x-slot:rightContent>
            <div class="dropdown dropdown-end">
                <div tabindex="0" role="button" class="btn btn-ghost btn-circle avatar">
                    <div class="w-10 rounded-full">
                        <div class="w-full h-full bg-primary/20 rounded-full flex items-center justify-center">
                            <span class="text-primary font-bold">{{ substr(Auth::user()->name, 0, 1) }}</span>
                        </div>
                    </div>
                </div>
                <ul tabindex="0" class="menu menu-sm dropdown-content bg-base-100 rounded-box z-[1] mt-3 w-52 p-2 shadow">
                    <!-- <li><a href="{{ route('profile') }}">个人资料</a></li>
                    <li><a href="#">设置</a></li> -->
                    <li>
                        <form method="POST" action="{{ route('logout') }}">
                            @csrf
                            <button type="submit" class="w-full text-left">退出登录</button>
                        </form>
                    </li>
                </ul>
            </div>
        </x-slot:rightContent>
    </x-navbar>
@endsection

@section('content')
    <div class="container mx-auto px-4 py-8">
        <!-- 欢迎信息 -->
        <div class="mb-8">
            <h1 class="text-3xl font-bold mb-2">欢迎回来，{{ Auth::user()->name }}！</h1>
            <p class="text-base-content/80">开始您的网红信用查询之旅</p>
        </div>

        <!-- 功能卡片 -->
        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 mb-8">
            <!-- 快速查询 -->
            <x-card 
                title="快速查询"
                description="输入网红昵称或平台ID，快速获取信用信息"
                :icon="'<svg class=\"w-6 h-6 text-primary\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">
                    <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z\"></path>
                </svg>'"
                :actions="'<button class=\"btn btn-primary btn-block\">开始查询</button>'"
            />

            <!-- 提交报告 -->
            <x-card 
                title="提交报告"
                description="提交网红不良行为记录，帮助社区"
                :icon="'<svg class=\"w-6 h-6 text-accent\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">
                    <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 6v6m0 0v6m0-6h6m-6 0H6\"></path>
                </svg>'"
                icon-bg="bg-accent/10"
                :actions="'<button class=\"btn btn-accent btn-block\">提交报告</button>'"
            />
        </div>

        <!-- 最近查询 -->
        <x-card title="最近查询记录">
            <div class="overflow-x-auto">
                <table class="table table-zebra">
                    <thead>
                        <tr>
                            <th>网红名称</th>
                            <th>平台</th>
                            <th>查询时间</th>
                            <th>风险等级</th>
                            <th>操作</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>示例网红A</td>
                            <td>YouTube</td>
                            <td>2024-12-21 10:30</td>
                            <td><span class="badge badge-success">低风险</span></td>
                            <td><x-button variant="outline" size="sm">查看详情</x-button></td>
                        </tr>
                        <tr>
                            <td>示例网红B</td>
                            <td>YouTube</td>
                            <td>2024-12-20 15:22</td>
                            <td><span class="badge badge-warning">中风险</span></td>
                            <td><x-button variant="outline" size="sm">查看详情</x-button></td>
                        </tr>
                        <tr>
                            <td>示例网红C</td>
                            <td>YouTube</td>
                            <td>2024-12-19 09:15</td>
                            <td><span class="badge badge-error">高风险</span></td>
                            <td><x-button variant="outline" size="sm">查看详情</x-button></td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </x-card>
    </div>
@endsection 